<%@ page import="com.cxl.entity.User" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: 20971
  Date: 2021/12/30
  Time: 13:45
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>发布课程</title>
    <link rel="stylesheet" href="resource/css/bootstrap.css">
    <script type="text/javascript" src="resource/js/jquery-3.2.1.js"></script>
</head>
<body>

<%
    User user = (User) request.getSession().getAttribute("LONGUSER");
%>
<h1 class="text-center">
    欢迎<%=user.getUsername()%>
    <c:if test="<%=user.getRole()==1%>">讲师</c:if>
    登陆到教育平台系统
</h1>

<form:form modelAttribute="course" action="list" method="post" enctype="multipart/form-data">
    <table class="table table-hover">
        <tr>
            <td>课程名称</td>
            <td>
                <form:input path="cname" onblur="toblue(this.value)"></form:input>
                <span id="sp1" style="color: red"></span>
            </td>
        </tr>
        <tr>
            <td>课程分类</td>
            <td>
                <select name="tid">
                    <option value="">请选择课程分类</option>
                    <c:forEach items="${types}" var="t">
                        <option value="${t.tid}">${t.tname}</option>
                    </c:forEach>
                </select>
            </td>
        </tr>
        <tr>
            <td>课程状态</td>
            <td>
                <input type="radio" name="state" value="1">上架
                <input type="radio" name="state" value="0">下架
            </td>
        </tr>
        <tr>
            <td>课程图标</td>
            <td>
                <input type="file" name="file" onchange="tofile()">
                <img src="" width="120" height="100" class="img">
                <form:hidden path="pic"></form:hidden>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="hidden" name="uid" value="<%=user.getUid()%>">
                <input type="hidden" name="token" value="${token}">
                <input type="button" value="发布课程" onclick="toadds()">
            </td>
        </tr>
    </table>
</form:form>

<script>

    /*非空+唯一性效验*/
    function toblue(val) {
        if(val){
            $("#sp1").html("");
            $.post("getCname",{'cname':val},function (msg) {
                if(msg){
                    $("#sp1").html("该课程名称已存在,请重新输入");
                }else{
                    $("#sp1").html("");
                }
            })
        }else{
            $("#sp1").html("不能为空");
        }
    }

    /*发布*/
    function toadds() {
        var flag = true;
        var val = $("#cname").val();
        if(val){
            $("#sp1").html("");
            /*防止异步*/
            $.ajaxSettings.async=false;
            $.post("getCname",{'cname':val},function (msg) {
                if(msg){
                    $("#sp1").html("该课程名称已存在,请重新输入");
                    flag = false;
                }else{
                    $("#sp1").html("");
                }
            })
            $.ajaxSettings.async=true;
        }else{
            flag = false;
            $("#sp1").html("不能为空");
        }

        if(flag){
            $.ajaxSettings.async=false;
            $.post("add",$("form").serialize(),function (msg) {
                if(msg.code == 200){
                    location.href= "list?role=<%=user.getRole()%>"
                }else{
                    //重复
                    alert("不可重复提交");
                    alert(msg.msginfo);
                }
            })
            $.ajaxSettings.async=true;
        }
    }

    /*上传图片*/
    function tofile() {
        var formData = new FormData($("form")[0]);
        $.ajax({
            url:"getfile",
            data:formData,
            type:"post",
            contentType:false,
            processData:false,
            success:function (msg) {
                $(".img").prop("src",msg);
                $("#pic").val(msg);
            }
        })
    }
</script>
</body>
</html>
